<html>
	<head> <link type="text/css" rel="stylesheet" href="style.css"> </head>
  <body>
    <h3 id="status">dart is not running</h3>
    <div id="leftnav">
    	Radius: <div style="float:right" id='rad'>1</div> <input type="range" min=".5" max="10" value="1" step=".5" id='radius'/></br>
    	Density: <div style="float:right" id='dens'>1</div><input type="range" min=".5" max="300" value="1" id='density'/></br>

    	Restitution:<div style="float:right" id='rest'>1</div> <input type="range" min="0" max="2" step="0.10" value="1" id='restitution'/></br>
    	Velocity:<div style="float:right" id='velo'>10</div> <input type="range" min="0" max="100" value="10" id='vel'/></br>
    	
    	Angle: <div style="float:right" id='ang'>45</div><input type="range" min="0" max="90" value="45" id="angle"/></br>
    	
    	<select id='color'>
    		<option>Red</option>
   		 	<option>Green</option>
   	 	<option>Blue</option>
    	</select>
    	<button id='addBall'>Launch ball</button>
    	<button id='clear'>Clear</button>
    	
    	</div>
    		<div id="playground">
    	</div>
	<script src="test.frog.js"></script>
  	</body>
</html>
